<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
    <title>首页</title>
	<script src="html5plus://ready"></script>
	<link rel="stylesheet" href="css/main.css"/>
	<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@1.6/lib/index.css"/>
	<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
	<script src="https://cdn.jsdelivr.net/npm/vant@1.6/lib/vant.min.js"></script>
</head>
<body>
	<div id="app">
			<van-tabbar v-model="active" @change="tabChange()">
			  <van-tabbar-item icon="shop-o">首页</van-tabbar-item>
			  <van-tabbar-item icon="apps-o">分类</van-tabbar-item>
			  <van-tabbar-item icon="shopping-cart-o">购物车</van-tabbar-item>
			  <van-tabbar-item icon="user-o">个人中心</van-tabbar-item>
			</van-tabbar>
	</div>
	<script type="text/javascript">
		var vm = new Vue({
			el:"#app",
			data:{
			    views:[
					{
						id:"home",
						url:"views/home.html"
					},
					{
						id:"classify",
						url:"views/classifys.html"
					},
					{
						id:"shop",
						url:"views/shop.html"
					},
					{
						id:"presonal",
						url:"views/presonal.html"
					}
				],
				active:0
			},
			methods:{
				tabChange:function(){
					plus.webview.show(this.views[this.active].id);
				}
			},
			mounted:function(){
				var rootWV=plus.webview.currentWebview();
				for (var i=0;i<this.views.length;i++){
					var tempWebView=plus.webview.create(this.views[i].url,this.views[i].id,{
						top:"0px",
						bottom:"50px",
						zindex:1,
						scrollIndicator:false
					})
					rootWV.append(tempWebView);
				}
				plus.webview.show(this.views[0].id);
			}
			
			
		})
	</script>
</body>
</html>